﻿@model InfoSource.Models.Views.ZipCodeLookupViewModel
		   
@{
	ViewBag.Title = "ZipCode Lookup";
    Layout = ViewBag.IsPartial == true ? "" : "~/Views/Shared/_Layout.cshtml";
}



    <div id="zipCodeLookupPage" class='pageContent' key="@Url.Content("~/home/zipcodelookup")">
		<h2 class="pageTitle">ZipCode Lookup</h2>

		<label class="search">Zipcode Search:</label>
		<input id="zipcode-searchbox" />

		<hr />

		<div id="zipcode-lookup-container-upper-data-fields">
			<label class="data-field" id="zipcode-lookup-zipcode-label">Zip Code:</label>
			<span class="data-field large" id="zipcode-lookup-zipcode-data-field">&nbsp;</span>
			
			<label class="data-field">City:</label>
			<span class="data-field large" id="zipcode-lookup-city-data-field">&nbsp;</span>
			
			<div id="zipcode-lookup-zipcode-map-container">
				
				<div id="zipcode-lookup-senior-and-specialist-infowindow">
					<fieldset class="tech senior" data-code="{senior code}" style="background-image: url({senior image url})">
						<legend>Senior:</legend>
						<span class="tech-name"></span>

						<fieldset class="tech specialist" data-code="{specialist code}" style="background-image: url({specialist image url})">
							<legend>Specialist:</legend>
							<span class="tech-name"></span>
						</fieldset>
					</fieldset>
				</div>

				<div id="zipcode-lookup-zipcode-map"></div>
			</div>

		</div>

		<!-- SERVICE PLAN -->
		<fieldset class="sp-section list-type-section">
			<legend>SERVICE PLAN:</legend>

			<div class="list-column">
				<label class="list-container sp-hvac">HVAC:</label>
				<div id="zipcode-lookup-ServicePlanHVACContractors" class="list-container work-performed-list sp-hvac">&nbsp;</div>
			</div>

			<div class="list-column">
				<label class="list-container sp-appliance">APPLIANCE:</label>
				<div id="zipcode-lookup-ServicePlanApplianceContractors" class="list-container work-performed-list sp-appliance">&nbsp;</div>
			</div>

		</fieldset>


		<!-- BROKERING -->
		<fieldset class="brokering-section list-type-section">
			<legend>BROKERING:</legend>

			<div class="list-column">
				<label class="list-container brokering-hvac">HVAC:</label>
				<div id="zipcode-lookup-BrokeringHVACContractors" class="list-container work-performed-list brokering-hvac">&nbsp;</div>
			</div>

			<div class="list-column">
				<label class="list-container brokering-appliance">APPLIANCE:</label>
				<div id="zipcode-lookup-BrokeringApplianceContractors" class="list-container work-performed-list brokering-appliance">&nbsp;</div>
			</div>

		</fieldset>


		<!-- MISCELLANEOUS -->
		<fieldset class="sp-section list-type-section">
			<legend>MISCELLANEOUS:</legend>

			<div class="list-column">
				<div id="zipcode-lookup-MiscellaneousContractors" class="list-container work-performed-list miscellaneous">&nbsp;</div>
			</div>

		</fieldset>


		<!-- CONTRACTOR DETAILS PANEL -->
		<div id="contractor-details-panel" status="closed">
			<div id="contractor-details-panel-content">
			</div>
			<div id="contractor-details-panel-handle">
			</div>
		</div>

	</div>


@{
	this.ViewContext.Controller.ViewData["Scripts"] = new List<string>(){
		"/InfoSource/Content/Scripts/Views/ZipCodeLookup.js"
	};

	this.ViewContext.Controller.ViewData["StyleSheets"] = new List<string>(){
		"/InfoSource/Content/Styles/Views/ZipCodeLookup.css"
	};

	this.ViewContext.Controller.ViewData["InlineScripts"] = new List<string>(){
		"InfoSource.ZipCodeLookup.TypeAheadZipCodes = " + InfoSource.Utilities.Helpers.Serialize(Model.TypeAheadZipCodes) + ";",
		"InfoSource.ZipCodeLookup.ZipCodeContractorDetails = " + Model.ZipCodeContractorDetailsSerialized + ";"
	};
}

<script type="template" id="zipcode-lookup-list-item-template">
	<li class="list-item" contractor-code="{contractor code}">{contractor name}</li>
</script>

<script type="template" id="zipcode-lookup-senior-and-specialist-infowindow-template">
	<fieldset class="tech senior" data-code="{senior code}" style="background-image: url({senior image url})">
		<legend>Senior:</legend>
		<span class="tech-name">{senior name}</span>

		<fieldset class="tech specialist" data-code="{specialist code}" style="background-image: url({specialist image url})">
			<legend>Specialist:</legend>
			<span class="tech-name">{specialist name}</span>
		</fieldset>
	</fieldset>
</script>

<script type="template" id="zipcode-lookup-contractor-details-panel-template">
	<span class="contractor-name">{name}</span><span class="contractor-code">{code}</span>
	<table border="1">
		<tr>
			<td class="label">Phone:</td>
			<td class="phone">{phone}</td>
		</tr>
		<tr>
			<td class="label">Fax:</td>
			<td class="fax">{fax}</td>
		</tr>
		<tr>
			<td class="label">Restrictions:</td>
			<td class="restrictions">{restrictions}</td>
		</tr>
		<tr>
			<td class="label">Work:</td>
			<td class="work">
				<div class="{hvac service plan}">HVAC Service Plan</div>
				<div class="{hvac brokering}">HVAC Brokering</div>
				<div class="{appliance service plan}">Appliance Service Plan</div>
				<div class="{appliance brokering}">Appliance Brokering</div>
				<div class="{miscellaneous}">Miscellaneous</div>
			</td>
		</tr>
	</table>


</script>